<template>
  <el-dialog :close-on-click-modal="false" :visible.sync="visible" title="部门人员查看" width="800px">
    <el-row :gutter="16">
      <el-col :span="8">
        <dept-tree @changeTree="handleChangeTree" />
      </el-col>
      <el-col :span="16">
        <user-table ref="userTable" />
      </el-col>
    </el-row>
    <div slot="footer">
      <el-button type="primary" @click="visible = false">关闭</el-button>
    </div>
  </el-dialog>
</template>

<script>
// 引用组件调用 show 方法显示

import DeptTree from '@/components/DeptTree'
import UserTable from './Table'

export default {
  components: {
    DeptTree,
    UserTable
  },
  data() {
    return {
      visible: false
    }
  },
  methods: {
    show() {
      this.visible = true
    },
    handleChangeTree(obj) {
      this.$refs.userTable.getId(obj)
    }
  }
}
</script>